<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="ie=edge,chrome=1">
    <meta name="referrer" content="never">
    <title>平滑滚动</title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }
        ul {
            list-style: none;
        }

        html {
            scroll-behavior: smooth;
        }

        body {
            width: 3000px;
            height: 3000px;
        }

        #abc {
            position: absolute;
            top: 2000px;
        }
    </style>
</head>
<body>
    页面顺滑滚动：
        方式一：
            window.scroll/By({
                top: xxx,
                left: xxx,
                behavior: "smooth"
            })
        方式二：
            给 html 添加css样式 { scroll-behaivor: smooth; }

    <a href="#abc">点击跳转到锚点</a>

    <div id="abc">abc</div>

    <script type="text/javascript">

        window.onclick = function (){
            // window.scroll({
            //     left: 1500,
            //     behavior: "smooth"
            // })

            window.scroll(1500, 1500);
        }
    </script>
</body>
</html>